<ng-container *ngFor="let item of listData">
    <div class="recomment-bg" [ngStyle]="item.itemLeft?.box?.recommentBgBoxCssStyle | styleFilter">
        <div class="item-left" appDebounceClick (debounceClick)="choose(item)" [ngStyle]="item.itemLeft?.box?.cssStyle | styleFilter">
            <i class="check-img" [ngStyle]="item.itemLeft?.box?.checkedCssStyle | styleFilter"
                [ngClass]="{'checked-img': item.checked}"></i>
        </div>

        <div class="common-right" [ngStyle]="item.itemRight?.box?.rightBoxCssStyle | styleFilter">


            <div class="topLeftCircle" *ngIf="item?.leftCircle" [ngStyle]="item.leftCircleCssStyle | styleFilter">

            </div>


            <div class="item-middle" *ngIf="item.imgUrl"
                [ngStyle]="item.itemRight?.box?.middleBoxCssStyle | styleFilter">
                <span class="authSpan" *ngIf="item.itemRight?.auth"
                    [ngStyle]="item.itemRight?.auth?.cssStyle|styleFilter">{{item.itemRight?.auth?.label}}</span>
                <img class="defaultImg" *ngIf="item.imgUrl && item.imgUrl.length > 0" src="{{item.imgUrl}}"
                    [ngStyle]="item.imgUrlCssStyle | styleFilter"
                    onerror="this.src='assets/fw/expert_icon_chat_location.png'" />
            </div>

            <div class="item-right" [ngClass]="{'imgWidth': item.imgUrl!=='','noImgWidth':!item.imgUrl}"
                [ngStyle]="item.itemRight?.box?.cssStyle | styleFilter">
                <p class="item-title" [ngStyle]="item.firstRowLeft?.box?.cssStyle | styleFilter">
                    <span *ngIf="item.firstRowLeft?.firstTag?.label" class="title-status 1"
                        [ngStyle]="item.firstRowLeft?.firstTag?.cssStyle | styleFilter">{{item.firstRowLeft.firstTag.label}}</span>
                    <span class="title" appDebounceClick (debounceClick)="detailPage(item.firstRowLeft?.title?.link)"
                        *ngIf="item.firstRowLeft?.title?.label"
                        [ngStyle]="item.firstRowLeft?.box?.titleCssStyle | styleFilter"><span
                            *ngIf="item.firstRowLeft?.thirdTag?.label" class="title-status 2"
                            [ngStyle]="item.firstRowLeft?.thirdTag?.cssStyle | styleFilter">{{item.firstRowLeft.thirdTag.label}}</span>{{item.firstRowLeft.title.label}}</span>
                    <span *ngIf="item.firstRowLeft?.firstText?.label" class="title-status 3"
                        [ngStyle]="item.firstRowLeft?.firstText?.cssStyle | styleFilter">{{item.firstRowLeft.firstText.label}}</span>

                    <!--checkLabel-->
                    <span *ngIf="item.firstRowLeft?.firstText?.checkLabel" class=" 4"
                        [ngStyle]="item.firstRowLeft?.firstText?.checkLabelCssStyle | styleFilter"
                        [ngClass]="{'checkLabel': item.checked}">{{item.firstRowLeft.firstText.checkLabel}}</span>
                    <span *ngIf="item.firstRowLeft?.secondTag?.label" class="title-status 5"
                        [ngStyle]="item.firstRowLeft?.secondTag?.cssStyle | styleFilter">{{item.firstRowLeft.secondTag.label}}
                        <div *ngIf="item.firstRowLeft?.secondTag?.hiddenSpLine===undefined"
                            [ngStyle]="item.secondRowLeft?.secondTag?.lineCssStyle | styleFilter" class="spLine"></div>
                    </span>
                </p>
                <p class="item-title-sub 1" *ngIf="item.secondRowLeft?.firstText?.label"
                    [ngStyle]="item.secondRowLeft?.firstText?.cssStyle | styleFilter">
                    {{item.secondRowLeft.firstText.label}}
                    <ng-container *ngIf="item.secondRowLeft.secondText?.label">
                        <div *ngIf="item.secondRowLeft?.secondText?.hiddenSpLine===undefined"
                            [ngStyle]="item.secondRowLeft?.secondText?.lineCssStyle | styleFilter" class="spLine"></div>
                        <font [ngStyle]="item.secondRowLeft?.secondText?.cssStyle | styleFilter">
                            {{item.secondRowLeft.secondText?.label}}</font>
                    </ng-container>
                    <ng-container *ngIf="item.secondRowLeft.thirdText?.label">
                        <div *ngIf="item.secondRowLeft?.thirdText?.hiddenSpLine===undefined"
                            [ngStyle]="item.secondRowLeft?.thirdText?.lineCssStyle | styleFilter" class="spLine"></div>
                        <font [ngStyle]="item.secondRowLeft?.thirdText?.cssStyle | styleFilter">
                            {{item.secondRowLeft.thirdText?.label}}</font>
                    </ng-container>
                    <ng-container *ngIf="item.secondRowLeft.fourthText?.label">
                        <div *ngIf="item.secondRowLeft?.fourthText?.hiddenSpLine===undefined"
                            [ngStyle]="item.secondRowLeft?.fourthText?.lineCssStyle | styleFilter" class="spLine"></div>
                        <font [ngStyle]="item.secondRowLeft?.fourthText?.cssStyle | styleFilter">
                            {{item.secondRowLeft.fourthText?.label}}</font>
                    </ng-container>
                </p>
                <!-- address -->
                <p class="item-title-sub 2" *ngIf="item.fifthRowLeft?.firstText"
                    [ngStyle]="item.fifthRowLeft?.firstText?.cssStyle | styleFilter">
                    <img class="address-icon" *ngIf="item.fifthRowLeft?.firstText?.png"
                        src="{{item.fifthRowLeft?.firstText?.png}}"
                        onerror="this.src='assets/icon/list_icon_location@3x.png'"
                        [ngStyle]="item.fifthRowLeft.firstText.pngCssStyle | styleFilter" alt="">
                    <span style="display: inline-block; margin-left: 0.5rem;"
                        [ngStyle]="item.fifthRowLeft?.secondText?.cssStyle | styleFilter">{{item.fifthRowLeft.secondText.label}}
                    </span>
                </p>
                <!-- call -->
                <p class="item-title-sub 3" *ngIf="item.thirdRowLeft?.firstText?.label"
                    [ngStyle]="item.thirdRowLeft?.firstText?.cssStyle | styleFilter"
                    appDebounceClick (debounceClick)="call(item.thirdRowLeft.firstText.label)"> {{item.thirdRowLeft.firstText.label}} <span
                        style="display: inline-block; margin-left: 0.5rem;">{{item.thirdRowLeft.secondText.label}}
                    </span>
                </p>
                <!-- 奖金 -->
                <p class="item-title-sub 4" *ngIf="item.middleRowLeft?.firstText?.label"
                    [ngStyle]="item.middleRowLeft?.firstText?.cssStyle | styleFilter">
                    {{item.middleRowLeft.firstText.label}} </p>

                <!--蜂喔赚钱宝1.7.1新增 具体要求：-->
                <div class="require-bg item-title-2line" *ngIf="item.sixthRowLeft?.firstText?.label"
                    [ngStyle]="item.sixthRowLeft?.box?.cssStyle | styleFilter">
                    <span class="require-label"><i style="z-index: 2; position: relative;">
                            <font [ngStyle]="item.sixthRowLeft?.firstText?.labelCssStyle | styleFilter">
                                {{item.sixthRowLeft?.firstText?.label}}</font>
                        </i><i class="require-label-bg"></i></span>
                    <span
                        [ngStyle]="item.sixthRowLeft?.firstText?.descriptionCssStyle | styleFilter">{{item.sixthRowLeft?.firstText?.description}}</span>
                </div>
                <div class="recomment-s-a" *ngIf="item.bottomRowLeft || item.fourthRowRight"
                    [ngStyle]="item.bottomRowLeft?.box?.cssStyle | styleFilter">
                    <div>
                        <p class="item-title-sub 5" *ngIf="item.bottomRowLeft?.firstText?.label"
                            [ngStyle]="item.bottomRowLeft?.firstText?.cssStyle | styleFilter">
                            {{item.bottomRowLeft.firstText.label}} </p>
                    </div>
                    <div [ngStyle]="item.fourthRowRight?.cssStyle | styleFilter">
                        <p class="item-recoment-status 1"
                            [ngStyle]="item.fourthRowLeft?.firstText?.cssStyle | styleFilter">
                            {{item.fourthRowLeft?.firstText?.label}}</p>
                        <!--蜂喔商户1.6.17新增按钮-->
                        <p *ngIf="item.fourthRowRight?.commonBtn1?.label" class="recomment-action 1"
                            [ngStyle]="item.fourthRowRight?.commonBtn1?.cssStyle | styleFilter"
                            appDebounceClick (debounceClick)="doAction(item.fourthRowRight.commonBtn1)">
                            {{item.fourthRowRight?.commonBtn1?.label}}
                        </p>
                        <!--蜂喔商户1.6.17新增按钮-->
                        <p *ngIf="item.fourthRowRight?.commonBtn2?.label" class="recomment-action 2"
                            [ngStyle]="item.fourthRowRight?.commonBtn2?.cssStyle | styleFilter"
                            appDebounceClick (debounceClick)="doAction(item.fourthRowRight.commonBtn2)">
                            {{item.fourthRowRight?.commonBtn2?.label}}
                        </p>
                        <!-- lj 电话 -->
                        <p *ngIf="item.fourthRowRight?.phoneBtn?.phone" class="recomment-action 3"
                            [ngStyle]="item.fourthRowRight?.phoneBtn?.cssStyle | styleFilter"
                            appDebounceClick (debounceClick)="recommentPhoneAction(item.fourthRowRight?.phoneBtn?.phone)">
                            {{item.fourthRowRight?.phoneBtn?.label}}</p>
                        <!--蜂喔赚钱宝1.7.1-->
                        <p *ngIf="item.fourthRowRight?.buttonLink?.label" class="recomment-action 4"
                            [ngStyle]="item.fourthRowRight?.buttonLink?.link?.params?.btnCssStyle|styleFilter"
                            appDebounceClick (debounceClick)="goPage(item.fourthRowRight?.buttonLink)">{{item.fourthRowRight?.buttonLink?.label}}
                        </p>

                        <p *ngIf="item.fourthRowRight?.buttonLink1?.label" class="recomment-action 5"
                            [ngStyle]="item.fourthRowRight?.buttonLink1?.link?.params?.btnCssStyle|styleFilter"
                            appDebounceClick (debounceClick)="goPage(item.fourthRowRight?.buttonLink1)">
                            {{item.fourthRowRight?.buttonLink1?.label}}
                        </p>
                        <p *ngIf="item.fourthRowRight?.commonBtn?.label" class="recomment-action 6"
                            [ngStyle]="item.fourthRowRight?.commonBtn?.cssStyle|styleFilter"
                            appDebounceClick (debounceClick)="recommentAction(item)">{{item.fourthRowRight?.commonBtn?.label}}</p>

                        <!-- ppw 推荐 -->
                        <p *ngIf="item.fourthRowRight?.label" [ngStyle]="item.fourthRowRight?.labelCssStyle|styleFilter"
                            class="recomment-action 7" appDebounceClick (debounceClick)="recommentAction(item)">
                            {{item.fourthRowRight?.label}}</p>
                    </div>
                </div>
                <div class="recomment-s-a" *ngIf="item.fifthRowLeft?.firstText?.label || item.fifthRowRight"
                    [ngStyle]="item.bottomRowLeft?.box1?.cssStyle | styleFilter">
                    <p class="item-recoment-status 2" [ngStyle]="item.fifthRowLeft?.firstText?.cssStyle | styleFilter">
                        {{item.fifthRowLeft?.firstText?.label}}</p>
                    <!--蜂喔商户1.6.17新增按钮-->
                    <p *ngIf="item.fifthRowRight?.commonBtn1?.label" class="recomment-action"
                        [ngStyle]="item.fifthRowRight?.commonBtn1?.cssStyle | styleFilter"
                        appDebounceClick (debounceClick)="doAction(item.fifthRowRight.commonBtn1)">{{item.fifthRowRight?.commonBtn1?.label}}
                    </p>

                    <!--蜂喔商户1.6.18新增按钮-->
                    <p *ngIf="item.fifthRowRight?.commonBtn2?.label" class="recomment-action"
                        [ngStyle]="item.fifthRowRight?.commonBtn2?.cssStyle | styleFilter"
                        appDebounceClick (debounceClick)="doAction(item.fifthRowRight.commonBtn2)">{{item.fifthRowRight?.commonBtn2?.label}}
                    </p>

                    <!-- lj 电话 -->
                    <p *ngIf="item.fifthRowRight?.phoneBtn?.phone" class="recomment-action"
                        [ngStyle]="item.fifthRowRight?.phoneBtn?.cssStyle | styleFilter"
                        appDebounceClick (debounceClick)="recommentPhoneAction(item.fifthRowRight?.phoneBtn?.phone)">
                        {{item.fifthRowRight?.phoneBtn?.label}}</p>

                    <!--蜂喔赚钱宝1.7.1-->
                    <p *ngIf="item.fifthRowRight?.buttonLink?.label" class="recomment-action"
                        appDebounceClick (debounceClick)="goPage(item.fifthRowRight?.buttonLink)"
                        [ngStyle]="item.fifthRowRight?.buttonLink?.link?.params?.btnCssStyle|styleFilter">
                        {{item.fifthRowRight?.buttonLink?.label}}</p>

                    <p *ngIf="item.fifthRowRight?.buttonLink1?.label" class="recomment-action"
                        appDebounceClick (debounceClick)="goPage(item.fifthRowRight?.buttonLink1)"
                        [ngStyle]="item.fifthRowRight?.buttonLink1?.link?.params?.btnCssStyle|styleFilter">
                        {{item.fifthRowRight?.buttonLink1?.label}}
                    </p>

                    <p *ngIf="item.fifthRowRight?.commonBtn?.label"
                        [ngStyle]="item.fifthRowRight?.commonBtn?.cssStyle | styleFilter" class="recomment-action"
                        appDebounceClick (debounceClick)="recommentAction(item)">{{item.fifthRowRight?.commonBtn?.label}}</p>

                    <!-- ppw 推荐 -->
                    <p *ngIf="item.fifthRowRight?.label" [ngStyle]="item.fifthRowRight?.labelBtnCssStyle | styleFilter"
                        class="recomment-action" appDebounceClick (debounceClick)="recommentAction(item)">
                        {{item.fifthRowRight?.label}}</p>
                </div>
            </div>

        </div>
    </div>

    <!--1.8.2新增参数处理-->
    <div class="recomment-s-a" *ngIf="item.sixthRowRight" [ngStyle]="item.sixthRowRight?.box1?.cssStyle | styleFilter">
        <p class="item-recoment-status 3" [ngStyle]="item.sixthRowRight?.firstText?.cssStyle | styleFilter">
            {{item.sixthRowRight?.firstText?.label}}</p>

        <!--蜂喔商户1.6.17新增按钮-->
        <p *ngIf="item.sixthRowRight?.commonBtn1?.label" class="recomment-action"
            [ngStyle]="item.sixthRowRight?.commonBtn1?.cssStyle | styleFilter"
            appDebounceClick (debounceClick)="doAction(item.sixthRowRight.commonBtn1)">{{item.sixthRowRight?.commonBtn1?.label}}
        </p>

        <!--蜂喔商户1.6.18新增按钮-->
        <p *ngIf="item.sixthRowRight?.commonBtn2?.label" class="recomment-action"
            [ngStyle]="item.sixthRowRight?.commonBtn2?.cssStyle | styleFilter"
            appDebounceClick (debounceClick)="doAction(item.sixthRowRight.commonBtn2)">{{item.sixthRowRight?.commonBtn2?.label}}
        </p>

        <!-- lj 电话 -->
        <p *ngIf="item.sixthRowRight?.phoneBtn?.phone" class="recomment-action"
            [ngStyle]="item.sixthRowRight?.phoneBtn?.cssStyle | styleFilter"
            appDebounceClick (debounceClick)="recommentPhoneAction(item.sixthRowRight?.phoneBtn?.phone)">
            {{item.sixthRowRight?.phoneBtn?.label}}</p>

        <!--蜂喔赚钱宝1.7.1-->
        <p *ngIf="item.sixthRowRight?.buttonLink?.label" class="recomment-action"
            appDebounceClick (debounceClick)="goPage(item.sixthRowRight?.buttonLink)"
            [ngStyle]="item.sixthRowRight?.buttonLink?.link?.params?.btnCssStyle|styleFilter">
            {{item.sixthRowRight?.buttonLink?.label}}</p>

        <p *ngIf="item.sixthRowRight?.buttonLink1?.label" class="recomment-action"
            appDebounceClick (debounceClick)="goPage(item.sixthRowRight?.buttonLink1)"
            [ngStyle]="item.sixthRowRight?.buttonLink1?.link?.params?.btnCssStyle|styleFilter">
            {{item.sixthRowRight?.buttonLink1?.label}}
        </p>

        <p *ngIf="item.sixthRowRight?.commonBtn?.label" class="recomment-action" appDebounceClick (debounceClick)="recommentAction(item)"
            [ngStyle]="item.sixthRowRight?.commonBtn?.cssStyle | styleFilter">
            {{item.sixthRowRight?.commonBtn?.label}}</p>

        <!-- ppw 推荐 -->
        <p *ngIf="item.sixthRowRight?.label" [ngStyle]="item.sixthRowRight?.labelBtnCssStyle | styleFilter"
            class="recomment-action" appDebounceClick (debounceClick)="recommentAction(item)">
            {{item.sixthRowRight?.label}}</p>
    </div>
    <hr *ngIf="!item.bottomBox?.hiddenLine" class="bottomLine"
        [ngStyle]="item.bottomBox?.bottomLineCssStyle | styleFilter">
</ng-container>
<p class="noData" *ngIf="!listData || listData.length === 0">
    <ng-container *ngIf="tagData.hint">
        {{tagData.hint}}
    </ng-container>
    <ng-container *ngIf="!tagData.hint">
        暂无数据
    </ng-container>
</p>
<ion-infinite-scroll *ngIf="tagData.data.submit && pageTotal &&  (pageSize * pageNo < pageTotal) " threshold="5%"
    (ionInfinite)="loadMoreData($event)">
    <ion-infinite-scroll-content loadingSpinner="crescent" loadingText="正在加载更多数据...">
    </ion-infinite-scroll-content>
</ion-infinite-scroll>